<script setup lang="ts">
// 停止抢位
import {message, Modal} from "ant-design-vue";
import {WxtBizCode, WxtUtils} from "~/contentScripts/views/wxt/lib/wxtUtils";

const props = defineProps({
  rows: {
    type: Array,
    default: () => []
  },
  bizCode: {
    type: String as PropType<WxtBizCode>,
    default: WxtBizCode.关键字推广,
  },
});
const emit = defineEmits([
  "refresh",
]);
const realRows = ref<any[]>(props.rows.filter((row: any) => row.type === 'kw' && (row.bidStrategyInfo && row.bidStrategyInfo?.status === 1)));
const visible = ref(false);
watch(() => props.rows, (newVal) => {
  realRows.value = newVal.filter((row: any) => row.type === 'kw' && (row.bidStrategyInfo && row.bidStrategyInfo?.status === 1));
}, {
  deep: true
});
const handle = () => {
  if (realRows.value.length === 0) {
    message.error('请先勾选表格正在抢位的关键词数据！');
    return;
  }
  Modal.confirm({
    title: '提示',
    content: '确定停止关键词抢位吗?',
    onOk() {
      WxtUtils.customRequest('https://one.alimama.com/bidword/update.json', props.bizCode, {
        bidwordList: realRows.value.map((row: any) => {
          return {
            adgroupId: row.adgroupId,
            bidStrategyInfo: {
              ...row.bidStrategyInfo,
              status: 0
            },
            bidwordId: row.bidwordId,
            campaignId: row.campaignId
          }
        }),
      }).then(res => {
        message.success('操作成功！');
        emit('refresh');
      }).catch(() => {
        message.error('操作失败！');
      });
    },
    onCancel() {
      console.log('Cancel');
    },
  });
}
</script>

<template>
  <div style="display: inline-block" @click="handle">
    <slot>
      <a-button type="primary" size="small" ghost>停止抢位</a-button>
    </slot>
  </div>
</template>

<style scoped>

</style>
